<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>霜之哀伤</title>
    <link rel="stylesheet" type="text/css" href="/static/writer/css/index-2017051107-f.css">
    <link rel="stylesheet" type="text/css" href="/static/writer/css/UBXCMkzNVlaZYNs-f.css">



    <style>
        .content {
            font-size: 20px;
        }

        .content-zuopin {
            width: 1600px;
            height: 1600px;
            /* border: 1px solid red; */

        }

        .content-all {
            width: 1020px;
            height: 1200px;
            /* border: 1px solid red; */
            margin: 100px 325px;
        }

        .inputys {

            border: 1px solid rgb(111, 111, 111);

        }

        .zuopin {
            padding: 20px 200px;
        }

        .zhengwen {
            margin: 0px 70px;

        }

        .zpzw {
            margin: 0px 5px;
        }

        .zuopzj {
            margin: 0px -197px;
        }

        .zpfl {
            margin: 0px 35px;
        }

        .fm-all {
            width: 400px;
            height: 250px;
            /* border: 1px solid red; */
            margin: 25px 270px;
        }

        .fm {
            width: 200px;
            height: 200px;
            border: 1px solid rgb(111, 111, 111);
        }

        .error {
            color: red;
        }
        .shum{
            font-size: 25px;
            margin: 75px 60px;
        }
        .zhangjie{
            border: 1px solid rgb(111, 111, 111);
        }
        .tijiao{
            background-color: rgb(249,147,43);
            color:black ;
            width:100px;
            height:50px;
        }
        .name{
            color: #0C82D9;
        }
        .table{
            width: 1500px;
            height:200px;
            text-align: center;
            margin: 110px 70px;
            font-size: 20px;
        }
        .table th{
            border: 1px solid rgb(111,111,111);
        }
        .table td{
            border: 1px solid rgb(111,111,111);
        }
    </style>
</head>

<body>

<div id="root">
    <div data-reactroot="" class="framePage">
        <div class="content-wrap">

            <!-- 头部 -->
            <header class="topbar"><h1 class="topbar-logo"><img src=""></h1><!-- react-empty: 118 -->
                <div class="topbar-right">
                    <ul class="top-nav clearfix">
                        <li class="topbar-sp-width">
                            <div class="fontsize14"><a href="{:url('index/writerpersonal')}">{$penname}</a></div>
                        </li>
                        <li class="user">
                            <div><a href=""><img class="frame-message-img"
                                                 src=""></a>
                            </div>
                        </li>
                        <li class="logout"><a href="{:url('index/writerout')}"><img class="frame-logout-img"
                                                                                    src=""></a>
                        </li>
                    </ul>
                </div>
            </header>


            <!-- 左导航栏 -->
            <div class="sidebar">
                <ul class="nav">

                    <li class="nav-tab" data-url="#/"><h3 class="active"><i class="anticon anticon-shortlong"></i>
                        作品管理</h3>
                        <ul class="two-nav" style="display: block;">
                            <li><a class="sidebarItems colorWhite" href="{:url('index/writerpersonal')}">
                                <div class="sidebarItems-text">作品列表</div>
                            </a></li>
                            <li><a class="sidebarItems colorWhite" href="{:url('writerfound')}">
                                <div class="sidebarItems-text">创建新书</div>
                            </a></li>
                            <li><a class="sidebarItems" href="{:url('index/authormoney')}">
                                <div class="sidebarItems-text">作者资产</div>
                            </a></li>
                        </ul>
                    </li>
                    <li class="nav-tab"><a class="" href="{:url('index/writerinfo')}"><h3><i class="anticon anticon-user"></i>
                        作者信息</h3></a></li>
                    <li class="nav-tab"><a class="" href="{:url('index/writerdata')}"><h3><i class="anticon anticon-tablet"></i>
                        作品数据</h3></a></li>
                    <li class="nav-tab"><a href="{:url('index/writernwes')}"><h3><i class="anticon anticon-short"></i>消息管理
                    </h3></a>

                    <li class="nav-tab"><a class="" href="{:url('index/writercheckout')}"><h3><i class="anticon anticon-money"></i>
                        结算中心</h3></a></li>
                </ul>
            </div>
            <div class="content-page">
                <div class="createbookPage">


                    <!--{block name="kth"}-->
                    <!-- 可替换主题部分 -->
                    <table style="width: 1200px;text-align: center;font-size: 20px">
                        <tr style="background-color: rgb(220,246,246);color: #0f0f0f">
                            <th style="height: 50px;">书名</th>
                            <th>月票</th>
                            <th>积分</th>
                            <th>兑换月票</th>
                            <th>兑换积分</th>
                            <th>RMB</th>
                        </tr>
                        {foreach $list as $k}
                        <tr>
                            <td style="height: 65px;">{$k['name']}</td>
                            <td>{$k['Tticket']}</td>
                            <td>{$k['integral']}</td>
                            <td><button style="background-color: rgb(220,246,246);width: 100px;height: 50px;color: #0f0f0f" tic-id="{$k['id']}" class="tic">兑换月票</button></td>
                            <td><button style="background-color: rgb(220,246,246);width: 100px;height: 50px;color: #0f0f0f" int-id="{$k['id']}" class="int">兑换积分</button></td>
                            <td style="color: red" class="total" data-id="{$k['id']}"></td>
                        </tr>
                        {/foreach}
                    </table>


                    <div style="color: #0f0f0f;font-size: 25px;margin: 80px 122px">
                        <p style="margin: 40px 0px">总月票:    <span style="color: red"class="ticket">{$sum}</span></p>
                        <p style="margin: 40px 0px">总积分:    <span style="color: red" class="integral">{$all['integral']}</span></p>
                        <button style="background-color: rgb(220,246,246);width: 100px;height: 50px;color: #0f0f0f;font-size: 20px" class="tottic" tottic-id="{$aid}">兑换月票</button>
                        <button style="background-color: rgb(220,246,246);width: 100px;height: 50px;color: #0f0f0f;margin: 0px 50px;font-size: 20px" class="totint" totint-id="{$aid}">兑换积分</button>
                        <p style="margin: 40px 0px">余额: <span style="color: red"class="balance">{$all['balance']}</span></p>
                        <p style="margin: 40px 0px"><a href="{:url('index/finance')}">充值</a></p>
                    </div>








                    <!--可替换结束-->
                    <!--{/block}-->


                </div>
            </div>
        </div>
    </div>
</div>
<script src="/static/writer/js/jquery-1.8.3.min.js"></script>
<script src="/static/writer/js/toastr.min.js"></script>
<script>
    //月票兑换
    $(function () {
        //触发月票兑换
        $('.tic').click(function () {
             tic = $(this).attr('tic-id');
             asd = $(this);
             ticket = $('.ticket');
            balance = $('.balance');
            if(confirm('您确定要将月票兑换为RMB?')){
                //选中该按钮的父级元素
                var obj = $(this).parents('tr');
                //执行兑换操作
                exchange(tic,obj);
            }

        });
    });

    //积分兑换
    $(function () {
        //触发积分兑换
        $('.int').click(function () {
            int = $(this).attr('int-id');
            asd = $(this);
            integral = $('.integral');
            balance = $('.balance');
            if(confirm('您确定要将积分兑换为RMB?')){
                //选中该按钮的父级元素
                var obj = $(this).parents('tr');
                //执行兑换操作
                intexchange(int,obj);
            }

        });
    });

    //总积分兑换
    $(function () {
        //触发积分兑换
        $('.totint').click(function () {
            var aid = $(this).attr('totint-id');
            integral = $('.integral');
            if(confirm('您确定要将积分兑换为RMB?')){
                totintexchange(aid);
            }

        });
    });


    //总月票兑换
    $(function () {
        //触发积分兑换
        $('.tottic').click(function () {
            var aid = $(this).attr('tottic-id');
            ticket = $('.ticket');
            if(confirm('您确定要将月票兑换为RMB?')){
                totticexchange(aid);
            }

        });
    });


    // 设置弹框参数
    toastr.options = {
        closeButton: true,//是否显示关闭按钮
        progressBar: true,//实现显示计时条
        timeOut: "3000",//自动关闭时间
        positionClass: "toast-bottom-left",//提示位置
    };
    
    //执行月票兑换的操作函数
    function exchange(tid,obj) {
        $.ajax({
            type: 'get',
            url: '/writer/index/writerexchange?id=' + tid,
            dateType: 'json',
            success:function (data) {
                console.log(data);
                if(data.status){
                    asd.parent().next().next().html(data.num);
                    asd.parent().prev().prev().html(0);
                    ticket.html(data.list.ticket);
                    balance.html(data.list.balance);
                }else{
                    alert('当前月票为零,不能兑换');
                }
            },
            error: function () {
                // AJAX执行失败
                alert('ajax操作失败');
            }
        });
    }


    //执行积分兑换的操作函数
    function intexchange(int,obj) {
        $.ajax({
            type: 'get',
            url: '/writer/index/writerintexchange?id=' + int,
            dateType: 'json',
            success:function (data) {
                console.log(data.status);
                if(data.status){
                    asd.parent().next().html(data.num);
                    asd.parent().prev().prev().html(0);
                    integral.html(data.list.integral);
                    balance.html(data.list.balance);
                }else{
                    alert('当前积分为零,不能兑换');
                }
            },
            error: function () {
                // AJAX执行失败
                alert('ajax操作失败');
            }
        });
    }


    //执行总积分兑换函数
    function totintexchange(aid) {
        $.ajax({
            type: 'get',
            url: '/writer/index/writertotintexchange?id=' + aid,
            dateType: 'json',
            success:function (data) {
                if(data.status){
                    $('.integral').html(data.list.integral);
                    $('.int').parent().prev().prev().html(0);
                    $('.balance').html(data.list.balance);
                }else{
                    alert('当前积分为零,不能兑换');
                }
            },
            error: function () {
                // AJAX执行失败
                alert('ajax操作失败');
            }
        });
    }


    //执行总月票兑换函数
    function totticexchange(aid) {
        $.ajax({
            type: 'get',
            url: '/writer/index/writertotticexchange?id=' + aid,
            dateType: 'json',
            success:function (data) {
                if(data.status){
                    ticket.html(data.list.ticket);
                    $('.tic').parent().prev().prev().html(0);
                    $('.balance').html(data.list.balance);
                }else{
                    alert('当前积分为零,不能兑换');
                }
            },
            error: function () {
                // AJAX执行失败
                alert('ajax操作失败');
            }
        });
    }
</script>


</body>
</html>